<template>
  <view class="profile-quick-enter">
    <uiGrid :columnNum="2">
      <uiGridItem boxClass="quick-enter-item">
        <navigator url="/pages/order/index/index" slot="content" hover-class="none">
          <view class="quick-enter-item--row ui-flex flex--vcenter flex--center">
            <image
              class="grid-item-image quick-enter-item--image"
              src="/static/images/profile/order.png"
            />
            <text>我的订单</text>
          </view>
          <view class="ui-txt txt-caption-sm actions-item--tips">查找您的全部订单信息</view>
        </navigator>
      </uiGridItem>
      <uiGridItem boxClass="quick-enter-item">
        <navigator url="/pages/message/index/index" slot="content" hover-class="none">
          <view class="quick-enter-item--row ui-flex flex--vcenter flex--center">
            <image
              class="grid-item-image quick-enter-item--image"
              src="/static/images/profile/message.png"
            />
            <text class="ui-txt txt-heading">消息中心</text>
          </view>
          <view class="ui-txt txt-caption-sm actions-item--tips">更好的建立与客户的联系</view>
        </navigator>
      </uiGridItem>
    </uiGrid>
  </view>
</template>

<script>
import uiGrid from "@/components/base/grid/index.vue";
import uiGridItem from "@/components/base/grid-item/index.vue";

export default {
  name: "profileActions",
  components: {
    uiGrid,
    uiGridItem
  },
  "mp-weixin": {
    options: {
      multipleSlots: true, // 在组件定义时的选项中启用多slot支持
      styleIsolation: "shared" //  这个选项等价于设置 styleIsolation: apply-shared ，但设置了 styleIsolation 选项后这个选项会失效。
    }
  },
  data() {
    return {};
  },
  created() {},
  mounted() {},
  methods: {}
};
</script>

<style scoped lang="scss">
.profile-quick-enter {
  padding: 24rpx 30rpx;
  >>> .quick-enter-item {
    border-radius: 18rpx;
    padding: 32rpx 0 21rpx 0;
    width: 333rpx;
    .quick-enter-item--image {
      width: 36rpx;
      height: 39rpx;
      margin-right: 19rpx;
    }
    .actions-item--tips {
      margin-top: 25rpx;
    }
  }
}
</style>
